<template>
  <hx-page>
	  <div class='card_detail'>
		  <div v-for="(item,index) in cardList" class='card_detail_item'
		        :key="index">{{item['key'] + '  :  ' + item['value']}}</div>
	  </div>
	  <button class='hxButton' @click="goNext">确认绑定</button>
  </hx-page>
</template>

<script>
	import {HxPost} from "../../service/http";
	import {json2Arr} from "../../utils/utils.js";
	import {HxTaro} from "../../utils/hx-taro.js";
export default {
  name: "index",
  data() {
    return {
      idcd: '',
      cardInfo: null
    }
  },
  computed:{
	  cardList(){
		  return json2Arr(this.cardInfo)
	  }
  },
  onLoad(e) {
    this.cardInfo = JSON.parse(e.data)
	this.idcd= e.idcd
  },
  methods: {
	 setData() {
	    uni.navigateBack({
	        delta: 2
	    });
	     // @ts-ignore
	     HxPost('payNum', {cardId: this.cardInfo.cardId})
	         .then((res) => {
	             uni.$emit('payNum', {
	                 index: 2,
	                 text: res['unChargeCnt'] ? res['unChargeCnt'] + '' : ''
	             });
	         });
	 },
    goNext() {
        uni.showModal({
            title: '',
            content: '确定绑定该卡吗？',
            cancelText: '取消',
            confirmText: '确定'
        })
            .then((data) => {
                if (data[1].confirm) {
                    return uni.showLoading({title: '加载中...', mask: true});
                } else {
                    return Promise.reject({retMsg: '取消绑定'});
                }
            })
            .then(() => {
                return HxPost('bind', {
                    cardId: this.cardInfo.cardId,
                    idcd: this.idcd,
                    isNeedIdcd: 'Y'
                });
            })
            .then(() => {
                this.setData();
            })
            .catch((err) => {
				console.log(err)
                uni.hideLoading();
                uni.showToast({title: err.retMsg || '未知错误', icon: 'none', duration: 2 * 1000}).catch();
            });
    }
  }
}
</script>

<style scoped lang="scss">
.card_detail {
    margin-bottom: 20PX;
    padding-left: 20PX;
    border-top: 1px solid #e1e1e1;
    border-bottom: 1px solid #e1e1e1;
    background: #FFF;
    &_item {
        border-top: 1PX solid #e1e1e1;
        line-height: 3;
        font-size: 15PX;
    }

    &_item:nth-child(1) {
        border-top: none;
    }
}

</style>
